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access to a particular pipe, it is assumed that the user is authorized and authenticated through all of 
the operations of a pipe. 

A selector is passed the name of the desired functional module and the name of the organization. 
The module name is also the name of the XML document containing the structure of the page to 
be rendered. 



The XML document follows the structure of the page, like so: 



I s * 



<xml> 
<module> 

(This section describes the name, organization, & logo information for this module) 
<section> 

(This section describes any menus or button bars that appear in the page header) 
</section> 

<sub_section> 

(This section describes any button bars, drop down list selectors, combo box selectors, 
data entry fields) 
</sub_section> 



<content> 

(This section describes any user interface components required for the content portion of 
N the page. This can include aJJ of the user interface elements described previously, plus 

I |j any applets, flash movies or other multimedia elements as required) 

</content> 

fj: 

B gj <toolbar> 

e ' (This section describes any selectors, checkboxes, button bars, drop down list selectors, 

' _ combo box selectors, or data entry fields required.) 

(3 </toolbar> 

k , i 

^ </module> 

(5 I 

t y 

''"-=4 Where possible, we have tried to use pre-existing standards for interface definition, rather than 



making up our own. Consequently, please refer to the following two documents located at the 
following URLs to get a flavor of the philosophy behind this structure: 

XUL Tutorial http:/Avww.xu!ptanet.com/tutoriats/xuitu/ 



XUL Programmer's Reference Manual http://www.mozilla.org/xpfe/xulref/ 

An example of this XML file structure, describing the NetCensus General Traffic Statistics page 
shown on page one of this specification is included on the next page. Although this description 
only describes the module, section, sub-section, and toolbar portions of the page, it should be 
enough to provide a flavor of how to define a page for use in the Marketing Framework. This file 
would be generated by an XSP script running in response to a user requesting a specific URI from 
a Cocoon server. 
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<?xml versions 1 .0" encoding="UTF-8'?> 

<!- edited with XML Spy v3.5 NT (http://vvvAYxrnlspyxom;> by N M. Kaufman (Centerville Technologies/ Encinee ring} - 
<module name="NelCertsus" sonified="yes'> 
<section> 

<menu name='main" prompt="SELECT A SECTION "> 

<menuitem name= "General Site Traffic' vaJue=-htto7Ardnk.witrHis^ 
<men litem name="Database Statistics" va]ue="rtr^/tNnk.wrth-us.com/^^ 
<menuitem nam&='Marketing Performance' value='rffip:/Ahmk.witrHis.^^ 
<menuitem name= , Commerdal Investment* value="http://tftr*.with-us.w^ 
<menuitem name=*Purchase Pathway" vaJue= , http7Ahink.wtm-us.conVncypathway'/> 
</menu> 
</section> 

<sub_section name="General Site Traffic"> 

<selector name="site_name' method^'post" action="> 
<list name="SiTES* prompt=*SELECT A SITE"> 
<listitem name='SALES SITES* value="i07> 
<listitem name='- Main Portal* value="1 1"/> 
<!istitem name='- Portal US* value="127> 
distitem name="- Portal Europe" value='137> 
<listitem name-"- Portal Asia* value="147> 
<tistitefn name=*- Business* value='157> 
<iistitem name="- Leisure" value='167> 
<listitem name=*- MCC* value="177> 
distitem name='- Cafe Express" value="l87> 
<listitem name="HOTEL SITES" value="207> 
<Iistitem name=*- Aberdeen* value="217> 
<listitem name="- Birmingham" value='227> 
<listitem name="- Kent" value="237> 
_ <listitern name='- London" value='247> 

*0 </fist> 

<date _picker name=*FROM" class="date" action="seJect7> 
\ p <date_ptcker name=" UNTIL" ctass="date" action-"se!ect*/> 

I . <button name="go* prompt="go' actions "submir/> 

! 5=1 </selector> 

• t i </sub_section> 
"*= <content> 

f S | < panel width="64%"> 

s ^ <lin e > 

! |l <checkbox labe)=" Page Views : " val ue= ' 1 8437> 

' ^ <checkbox label="Home Page views :" value="l 8437> 

ths </line> 
<line> 

E <checkbox label="Number of visitors :* valuer "1 8437> 

| «| <checkbox label="No. of Visitors per day :" value="1 8437> 

* </Iine> 
•J <ltne> 

. " <checkbox label="New Visitors :" valuer" t 843 7> 

6 U <checkbox label= "Length of Time on site :" vaiue="18437> 

. </line> 

' S} <line> 

: c% <checkbox label=" Repeal Visitors : " vatue=" 1 8437> 

==? <checkbox labe*= "Average no. of pages visited :" valuer" 1 8437> 

! </line> 

< table titie='Most Popular Pages" type="numbered*> 
<checkbox labet=* Millennium Deals' value="18437> 
<checkbox labet=*Stay.with-us - Hotel View" value=*1B437> 
< checkbox label=*Make a Booking* vaJue='1843*/> 
<checkbox label="Picture Gallery" value="18437> 
<rtabJe> 

< table title=*Top Referring Sites' type = 'numbered *> 

<checkbox tabel=" LondonTown.com* value="18437> 

<checkbox label='Thomas Cook" vaJue="18437> 

<checkbox labe!=" Sony.com" value='l8437> 
</table> 
<ypanel> 

< panel width ="36%">This is panel two (graph goes here) 
</panel> 
</content> 
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<toolbar name='exportBar" prompte'export to »"> 

<tool name^excelcxporr labef EXCEL' acforte'doExcel Export' tip-'Export this date to an MS Excel f3e7> 
<tool name= pPomtExport" labe^POWERPOlNr acUorteVtoPPdrvtExpofT tip=-Export this data as a PowerPoint 

<tool name=\wofdExport" labe^-WORD' actioo=-doWofd Export" tip- "Export this data to an MS Word fil^vT^^ ^ 
<tool name="ipegExpoff label="JPEG' action=*doJPegExport" tip= 'Export this data as a JPEG fmage7> 
<button name='printGraph' label=*PR| NT acUor^doPrintGraph' tip="Print a copy of the graph7> 
</toolbar> a 



</module> 



Section & Tag Descriptions 

<module names" text.display" sonrfied=" yes.or.no "> 

The <modute> section of the file is used to hold any information about the pipeline that may be re- 
quired throughout the life of the document as it moves through the pipeline. This tag takes a sin- 
gle attribute, which is the name of the module to display. The sonification attribute is used to in- 
voke the built-in Beatnik sounds for buttons, checkboxes, and tool bars. To date, we have defined 
the following tags: 

<organtzation> 

Specifies the name of this company (and it's associated stylesheet). 
<logo locations" text.uri or file name "/> 

Specifies where the company's logo can be found, in either gif, jpeg, or png format. 



<section> 

The <section> portion of the file is used to hold any information about the content that needs to ap- 
pear at the immediate top of the page. Typically, this will include one or more menus or button 
bars, from which the user will make a section that will cause other portions of the page to load. 
To date, we have defined the following tags: 

<menu name=" text " prompts" text.display "> 

Indicates that a menu should appear in the first available position in the section. This tag 
and its associated sub-tags describe the format of the menu to be displayed. (Typically 
these will appear as DHTML drop-down menus.) The structure of this tag is loosely based 
on the XUL standard for describing menu objects, although it is a subset of the 
specification, since many of the attributes do not make sense in the context of our 
application. 

name Name of menu object (for use with DHTML) 
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prompt Prompt text that appears in the user interface followed by a 
down arrow indicating where the user should click. 



<menuitem name=" text.display" values" uri.destination"> 

Indicates that an item should appear in the parent menu. This tag and its associated 
properties describe the format of the item to be displayed in the menu. 

name Contains text to be displayed for this item in the drop 
down menu. 

value URl of the web page to display if the user selects this 
menu Hem. 



<sub_section name=" text.display "> 

The <sub_section> portion of the file is used to hold any information about the content that needs 
t0 appear in the zone at the lower part of the top of the page. Typically, this will include one or 
more menus or button bars, or various "selector" interface widgets to allow the user to be able to 
* M search a database or otherwise modify what is displayed in the content section of the page. This 

?S ta S takes a single property, the name of the sub-section, which is formatted and displayed as a title 

in the sub-section area of the page. To date, we have defined the following tags: 



m 



<selector name=" text " method=" text.method" action=" javaScriptfunction "> 

Indicates that a form is to be inserted here to allow a user to make choices that will adjust 
s p the contents of another section of the application. The selector tag marks the demarcation 

s points for the form, and any widgets that will have their values submitted to the server 

i when the user clicks on the submit button. 

y name Name of the form object, which is required in order to 

I IJ manipulate the form via JavaScript / DHTML 

' *j method Text that indicates the method for handling the HTML form 

;== data. 



action Can be used to invoke a JavaScript / DHTML routine when 

the user submits this form. 

<button names" text " prompts" text.display* 9 action=" text"> 

Indicates that a button widget with a text label should be displayed in the first avail- 
able position with in the selector to allow a user to perform some action to the 
selector. 
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name Name of button object {required so list box contents can 
be accessed via JavaScript / DHTML). 

prompt Text that displays as a prompt on the face of the button, 
action Text that is filled in as the HTML button type. 



<date_picker names" text " prompt?" text.display"> 

Indicates that a single date widget should be displayed in the first available position 
with in the selector. A date widget allows the user to be able to specify a date in 
the form of MM/DD/YYYY, where "MM" is equal to the two digit value for the 
month of the year, while "DD" is equal to the two digit value for the day of the 
month, while "YYYY" is equal to the four digit value for the century. 

name Name of datejpicker object (required so list box contents 
can be accessed via JavaScript /DHTML). The individual 
fields in the widget will be accessible as name.mm for the 
month name.dd for the day, and name.yyyy for the year. 

prompt Text that displays as a prompt directly to the left of the list 
box widget. 



<list name=" text " prompts" text.display"> 

Indicates that either a single list box widget should be displayed in the first avail- 
able position with in the sub-section to allow a user to put together a query to mod- 
ify the specific contents of the content section of the page. 

name Name of list object (required so fist box contents can be 
accessed via JavaScript / DHTML). 

prompt Text that displays as a prompt directly to the left of the list 
box widget. 



<listitem name=" text.dispfay " value=" text.value "> 

Indicates that an item should appear in the list box widget. This tag and its 
associated properties describe the format of the item to be displayed in the 
menu. 



name Contains text to be displayed for this item in the list 
box widget. 

value Texr with value information (either alpha or 

numeric) that will be passed via a form submit. 
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<content> 

The <content> portion of the file is used to hold any information about the content that needs to ap- 
pear in the zone directly in the middle of the page. This can be defined in a variety of ways to re- 
flect a number of different display formats. This section can either be rendered as a single entity, 
or broken down into a series of vertical "panels. Within a panel, additional content can be speci- 
fied using either <line> or <table> tags (more information on this is available on the following 
pages). A good way to think about this structure is to consider it as being very similar to HTML 
tables where panels are equivalent to columns, and windows are equivalent to rows. However, 
this metaphor is not completely accurate, as we encapsulate the row data within a column, where 
in an HTML table the column data is encapsulated within the row data. This was changed for two 
reasons: the first was for easier processing within the XSLT engine; while the second had to do 
with how we were expecting data to be handled within the system. 

<graph> 

Indicates that the content contained within this tag should be rendered as a graph using the 
XSLT SVG graphing stylesheet. 

<panel width=" number.percentage 99 > 

Indicates that a vertical panel should be created in the content section of the page. Panels 
act as a way to organize content that should be located together on the page. 

Width Number used as a percentage of the width of the browser win- 
dow. Using a percentage allows us to rescale the relationship 
between individual objects within the page. Please note that 
the total width of all panels must not exceed 100%, as there is 
no error checking within the XSLT style sheet.. 

<line> 

Indicates that the content contained within this tag should be rendered as being on a single 
line, either inside of a panel, or simply within the entire content section of the page. Small 
lines of text, and selectors can be specified inside of <line> tags, and these will be rendered 
as a single line of content - similar in function and look and feel to a toolbar. Within a 
set of <line> tags, it is possible to specify the following tags: 

<chart_picker name=" text 99 prompt=" t&xt.disptay" target= 

"chart.namer> 

Indicates that a single chart type selection widget should be displayed in the first 
available position with in the line. A chart type selection widget allows the user to 
be able to specify the plot format of the chart named in the target property for the 
tag. 

name Name of chart_picker object. 
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prompt Text that displays as a prompt directly to the left of the 
chart picker selection widget. 

target Name of the chart that this picker is associated with. 



<data prompt=" text.display" type=" data. type " class=" ctass.type "> 

Indicates that a single piece of data should be displayed in the first available 
position with in the line. The format of the data is specified using both the type and 
class attributes as described below: 



SI 

m 

ill 



prompt Text to display to the left of the data as an explanatory 
label. 

type Can be one of three values: NUMBER, TEXT, or 

PERCENT. Specifying TEXT forces the prompt and the 
data to have the same amount of display space. 
Specifying either NUMBER or PERCENT causes the data 
to be displayed with the prompt taking up about 80% of 
the space, and the DATA taking up about 20% of the 
display space. 

class Can be specified as either MAJOR or MINOR. MAJOR 
data is rendered in bold and in a slightly larger type than 
MINOR data elements. 

<text> 

Used to render small amounts of text within the context of a set of <line> tags, or can be 
used by itself to render text either in a <panel> or simply stand-alone in the content sec- 
tion. 



I j 
''"4 
iy 



<table title=" text.display" type=" type.table"> 

Indicates that the content contained within this tag should be rendered in the form of a 
table, either inside of a panel, or simply within the entire content section of the page. Tab- 
les currently come in only two types - numbered and unnumbered. A numbered table gen- 
erates a list of entries with a number in front of each one, while an unnumbered table gen- 
erates them as a bulleted list. 



title Text to display as the title of the table. This text is handled 

differently depending on the XSLT and CSS style sheets used 
to create the final HTML document. 

type Determines how content is formatted within the table. 

Currently this attribute only supports two values: numbered, 
which creates a numbered list of items; and unnumbered 
which creates a bulleted list. 
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<toolbar names 1 ' text " prompt=" text.prompt"> 

The <toolbar> portion of the file is used to hold any information about the toolbar that runs along 
the bottom of the page. This can be defined in two ways - there are a series of selections (clIlo. 
"tools") that can be made from the solid colored section in the middle of the bar, and typically 
these selections will all be related to each other and would directly affect the content in the content 
pane. Because of this, typically the targets of the individual toolbar elements will probably be re- 
ferences to JavaScript / DHTML routines embedded in the page. On the right section of the tool- 
bar are a series of buttons that can be used to start external events, such as sending a copy of the 
web page to a printer. 

The components in the toolbar are always rendered as text links without decoration that can be 
clicked on to initiate an action. 

name Name of toolbar object (for use with DHTML) 

prompt Prompt text that appears in the toolbar to the left of the 

selections. 

<button name=" text " label=" text.display" action=" text " tip=" text "> 

Indicates that a link with a text label should be displayed in the first available position on 
the right side of the toolbar to allow a user to perform some action that affects the page as a 
whole. 

name Name of button object {required so list box contents can 

be accessed via JavaScript / DHTML). 

label T ext that displays as a prompt on the face of the toolbar. 

action Text that is used as the destination for an associated 

HREF tag. 

tip Text that appears as a "tool tip" when the user leaves 

the cursor over the link for more than a couple of 
seconds. 



<tool name=" text " label=" text.display" action=" text " tip=" text "> 

Indicates that a link with a text label should be displayed in the first available position with 
in the middle of the toolbar to allow a user to perform some action related to the content in 
the content section. 

name Name of button object {required so list box contents can 

be accessed via JavaScript / DHTML). 

label Text that displays as a prompt on the face of the toolbar. 

action Text that is used as the destination for an associated 

HREF tag. 



□ 
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tip Text that appears as a "tool tip" when the user leaves 

the cursor over the link for more than a couple of 
seconds. 



<T.BX>.> 



iu 
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